<template>
  <VerticalLayout class="home-view" style="height: 100vh">
    <van-button @click="startFlow">发起流程</van-button>
<!--    <FormEngine ref="form" v-model="model" :formDefinition="formDefinition" :action="actionId" :view="viewId" :forceDetail="false" />-->
<!--    <div>-->
<!--      <HInput v-model="text" placeholder="test" />-->
<!--    </div>-->
<!--    {{ text }}-->
<!--    <div style="margin: 10px; padding: 10px; border: 1px solid #818181">-->
<!--      {{model}}-->
<!--    </div>-->

<!--    <div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div>-->
<!--    <div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div>-->
<!--    <div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div>-->
<!--    <div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div>-->
<!--    <div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div>-->
<!--    <div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div>-->
<!--    <div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div>-->
<!--    <div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div><div>这里是填充的内容</div>-->

    <template #footer>
      <HomeMenu v-model="show"/>
    </template>
  </VerticalLayout>
</template>
<script setup>
import VerticalLayout from '@/components/Layout/VerticalLayout.vue';
import HomeMenu from '@/views/HomeView/HomeMenu.vue';
import {onMounted, ref, shallowRef} from 'vue';
import FormEngine from '@comp/FormEngine/FormEngine.vue';
import {getAction} from '@/request';
import {readFormDefinitionVo} from '@/utils';
import {useRouter} from 'vue-router';
import HInput from '@comp/FormEngine/HInput/HInput.vue';

defineOptions({name: 'HomeView'});
const show = ref(undefined);
const form = shallowRef();

const formDefinition = ref(undefined);
const actionId = ref(undefined);
const viewId = ref(undefined);
const model = ref(undefined);
const router = useRouter();
const text = shallowRef()

onMounted(() => {
  getAction('/form/queryById', {id: '04a325d4ba74411d81813b939fe2bc94'}).then(data => {
    if (data.success) {
      formDefinition.value = readFormDefinitionVo(data.result);
      console.log('加载到了表单定义:', formDefinition.value)
      actionId.value = '42232a9490f44207ba6f7fd9e264974e';
      viewId.value = 'b3482f47a6e24e78ba3fc7cbb92c5ac5';
    }
  });
})

function startFlow() {
  router.push({
    name: 'startFlow',
    query: {
      flowId: 'b52ef18166f04bee966464fc6a54bca7',
    }
  })
}

</script>
<style scoped>
.home-view {
  background: #f8f8f8;
  color: var(--van-text-color);
}
</style>